<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
        // 预解析案例
        // 案例1
        var num1 = 10;
        fun();

        function fun() {
            console.log(num1);
            var num1 = 20;
        }
        // 相当于执行了以下操作
        // var num1;

        // function fun() {
        //     var num1;
        //     console.log(num1);
        //     num1 = 20;
        // }
        // num1 = 10;
        // fun();

        // 案例2
        var num2 = 10;

        function fn() {
            console.log(num2);
            var num2 = 20;
            console.log(num2);
        }
        fn();
        // 相当于以下代码
        // var num2;

        // function fn() {
        //     var num2;
        //     console.log(num2);
        //     num2 = 20;
        //     console.log(num2);
        // }
        // num2 = 10;
        // fn();

        // 案例3
        var a = 18;
        f1();

        function f1() {
            var b = 9;
            console.log(a);
            console.log(b);
            var a = '123';
        }
        // 相当于以下代码
        // var a;

        // function f1() {
        //     var b;
        //     var a;
        //     b = 9;
        //     console.log(a);
        //     console.log(b);
        //     a = '123';
        // }
        // a = 18;
        // f1();
        console.log('\n');

        // 案例4
        f2();
        console.log(e);
        console.log(d);
        console.log(c);

        function f2() {
            var c = d = e = 9;
            console.log(c);
            console.log(d);
            console.log(e);
        }
        // 以下代码
        // function f2() {
        //     var c;
        //     c = d = e = 9;
        //     // 相当于 var  c  = 9; d = 9; e = 9; d 和 e 直接赋值 没有var 声明 当 全局变量看
        //     // 集体声明  var a = 9, b = 9, c = 9;
        //     console.log(c);
        //     console.log(d);
        //     console.log(e);
        // }
        // f2();
        // console.log(c);
        // console.log(d);
        // console.log(e);
    </script>
</head>

<body>

</body>

</html>